<template>
  <h1>flutter webview file api</h1>
  <el-button type="primary" @click="handleRootDocumentFiles">
    读取目录
  </el-button>
  <el-button type="primary" @click="handleNewDirectory"> 创建资目录 </el-button>
  <el-button type="primary" @click="handleExistsDirectory">
    判断文件夹是否存在
  </el-button>
  <el-button type="primary" @click="handleDeleteDirectory">
    删除当前文件夹内子目录
  </el-button>
  <el-button type="primary" @click="handleWriteFile"> 新建文件 </el-button>
  <el-button type="primary" @click="handleReadFile"> 读取文件 </el-button>
  <el-button type="primary" @click="handleExistsFile">
    判断文件是否存在
  </el-button>
  <el-button type="primary" @click="handleDeleteFile"> 删除文件 </el-button>
  <el-col :span="16">
    <p>日志：<span v-html="logs"></span></p>
  </el-col>
</template>

<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import handlerFile from "./handlerFile";
import utils from "../../../utils/utils";
//   import w from "../../../window"

const rootPath = ref("");
const fileName = ref("");
const writeString = ref("");
const readString = ref("");
const logs = ref("");

// 加载根目录内目录和文件
const handleRootDocumentFiles = async () => {
  rootPath.value = await handlerFile.getRootPath();
  // /data/user/0/com.summer.flutter_app/app_flutter
  loginfo("getRootPath:" + rootPath.value);

  ElMessageBox.prompt("不输入目录，默认读取应用目录", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      let path = rootPath.value;
      console.log("getRootPath value:", value);
      if (value != null) {
        path = rootPath.value + "/" + value;
      }
      const filesReturn = await handlerFile.fileListInDirectory(path);
      //[{"path":"/data/user/0/com.summer.flutter_app/app_flutter/flutter_assets", "type":"directory"},
      //{"path":"/data/user/0/com.summer.flutter_app/app_flutter/res_timestamp-1-1684140496669", "type":"file"}]
      loginfo("fileListInDirectory:" + JSON.stringify(filesReturn));
    })
    .catch((e) => {
      loginfo(`读取目录异常：` + e);
    });
};

// 新建文件夹
const handleNewDirectory = async () => {
  ElMessageBox.prompt("请输入要创建的英文目录名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      let tmp = await handlerFile.newDirectory(rootPath.value + "/" + value);
      loginfo("handleNewDirectory:" + tmp);
    })
    .catch((e) => {
      loginfo(`新建文件夹异常：` + e);
    });
};

const handleExistsDirectory = async () => {
  ElMessageBox.prompt("请输入目录名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      let tmp = await handlerFile.existsDirectory(rootPath.value + "/" + value);
      loginfo("handleExistsDirectory:" + tmp);
    })
    .catch((e) => {
      loginfo(`判断文件夹是否存在异常：` + e);
    });
};

// 删除文件夹
const handleDeleteDirectory = async () => {
  ElMessageBox.prompt("请输入要删除的目录名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      let tmp = await handlerFile.deleteDirectory(rootPath.value + "/" + value);
      loginfo("handleDeleteDirectory:" + tmp);
    })
    .catch((e) => {
      loginfo(`删除文件夹异常：` + e);
    });
};

// 新建文件
const handleWriteFile = async (folerName: string) => {
  ElMessageBox.prompt("请输入要创建的文件名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      let base64string = utils.base64Encode(
        "临时写入随机字符串：" + utils.getUUID()
      );
      let tmp = await handlerFile.writeFile(
        rootPath.value + "/" + value,
        base64string
      );
      loginfo("handleWriteFile:" + tmp);
    })
    .catch((e) => {
      loginfo(`新建文件异常：` + e);
    });
};

// 读取文件
const handleReadFile = async () => {
  ElMessageBox.prompt("请输入要读取的文件名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      const base64string = await handlerFile.readFile(
        rootPath.value + "/" + value
      );
      loginfo(`读取文件 ${value} 中的base64：` + base64string);
      const tmp = utils.base64Decode(base64string);
      loginfo(`读取文件 ${value} 中的内容：` + tmp);
    })
    .catch((e) => {
      loginfo(`读取文件异常：` + e);
    });
};

// 判断文件是否存在
const handleExistsFile = async () => {
  ElMessageBox.prompt("请输入文件名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      const tmp = await handlerFile.existsFile(rootPath.value + "/" + value);
      loginfo(`handleExistsFile：` + tmp);
    })
    .catch((e) => {
      loginfo(`判断文件是否存在异常：` + e);
    });
};

// 删除文件
const handleDeleteFile = async () => {
  ElMessageBox.prompt("请输入要删除的文件名称", "提示", {
    confirmButtonText: "OK",
    cancelButtonText: "Cancel",
  })
    .then(async ({ value }) => {
      const tmp = await handlerFile.deleteFile(rootPath.value + "/" + value);
      loginfo("handleDeleteFile:" + tmp);
    })
    .catch((e) => {
      loginfo(`删除文件异常：` + e);
    });
};

const loginfo = (msg: string) => {
  logs.value = msg + "<br>";
};

onMounted(() => {
  loginfo("onMounted");
});
</script>
